<template>
  <div :bordered="false">
    <f-table ref="table" rowKey="customRateId" :columns="columns" :multiple="false" handler="deptRateDrugsListHandler" :operator="operator" :autoLoad="false" :params="queryParam" :api="api.customRate">
        <span slot="action" slot-scope="text, record">
          <template>
              <a @click="editConfig(record)">编辑</a>
            <a-divider type="vertical"/>
          </template>
          <a-dropdown>
            <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
            <a-menu slot="overlay">
              <a-menu-item v-if="$auth('table.delete')">
                <a href="javascript:;" @click="$refs.table.del(record)">删除</a>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
        </span>
    </f-table>
    <a-modal title="部门价格配置" :visible="configModal" width="900px" height="500px" @cancel="handleCancel" @ok="handleSubmit">
      <f-form ref="form" :action="api.customRate" v-if="configModal" :form-key="this.formItem.customRateId">
        <f-form-item label="部门" ref="dept" type="select" name="deptId" :value="formItem.deptId" :data="api.dept.list" valueKey="deptId" label-key="deptName" :required="true" :params="queryParam"/>
        <f-form-item label="销售价格" type="number" name="drugsPrice" :value="formItem.drugsPrice" :precision="4"/>
        <f-form-item label="结算价格" type="number" name="settlePrice" :value="formItem.settlePrice" :precision="2"/>
      </f-form>
    </a-modal>
  </div>
</template>

<script>
  import api from './js/api'

  export default {
    name: 'DeptRateDrugs',
    components: {},
    data() {
      let me = this
      //操作按钮
      let operator = []
      operator.push({
        name: '添加',
        icon: 'plus',
        that: this,
        handler: function(table, that) {
          that.configModal = true
          that.$refs.form.resetFields()
        }
      })
      return {
        api: Object.assign(api, this.api),
        //列表初始化查询参数
        queryParam: {},
        configModal: false,
        params1: {
          drugsId: ''
        },
        formItem: {
          customRateId: '',
          drugsPrice: 1,
          settlePrice: 1
        },
        // 表头
        columns: [
          {
            title: '#',
            width: '60',
            align: 'center',
            customRender: (text, record, index) => index + 1
          },
          {
            title: '部门名称',
            align: 'center',
            dataIndex: 'deptName'
          },
          {
            title: '销售价',
            align: 'center',
            dataIndex: 'drugsPrice'
          },
          {
            title: '结算价',
            align: 'center',
            dataIndex: 'settlePrice'
          },
          {
            title: '操作',
            align: 'center',
            scopedSlots: { customRender: 'action' }
          }
        ],
        operator: operator
      }
    },
    created() {
    },
    methods: {
      setData(data) {
        if (data && data.drugsId) {
          this.queryParam.drugsId = data.drugsId
          this.$refs['table'].refresh(false)
        }
      },
      editConfig(record) {
        this.formItem = record
        this.configModal = true
      },
      handleSubmit() {
        this.$refs.form.submit({ drugsId: this.queryParam.drugsId }, this.handleCancel)
      },
      handleCancel() {
        this.configModal = false
      }
    }
  }
</script>